<template>
  <div class='autonym'>

    <!--<van-uploader :after-read="afterRead1"/>-->


    <van-nav-bar title="实名认证"
                 left-text=""
                 left-arrow
                 @click-left="onClickLeft"/>
    <div class='upload'>
      <div>
        <van-uploader :after-read="afterRead1" :max-count=1 :accept="'image/*'">
        <img :src='front'
             alt=""
             data-type='0'
             id="front">
        </van-uploader>
      </div>
      <div>
        <van-uploader :after-read="afterRead2" :max-count=1 :accept="'image/*'">
        <img :src='back'
             alt=""
             data-type='1'
             id="back">
        </van-uploader>
      </div>
      <p>
        <span>*注</span>
        <span>请确保图片清晰,图片格式为png,jpg,gif,jpeg,不超过10000kb,在上传过程中,如果长时间停止,请取消重传;获将图片缩小后重传.</span>
      </p>
    </div>
    <button class='enter' @click="upload">确认上传</button>
  </div>
</template>
<script>
  import {setStore, getStore} from '@/config/mUtils'

  export default {
    name: 'autonym',
    data() {
      return {
        front: require('../../../static/index/tu-14.png'),//正面图 路径
        back: require('../../../static/index/tu-15.png'),//背面图 路径
        img: [],
        imgId: 0
      }
    },
    methods: {
      upload() {
        if ( this.img.length === 0 || this.img.length === 1 ) {
          this.$toast.fail('请上传正反面两张照片！')
          return
        }
        this.$axios.post('user/certify', this.qs.stringify({
          "token": getStore("token"),
          "img": this.img
        })).then((res) => {
          if ( res.data.status === 1 ) {
            this.$toast.success(res.data.message)
            this.$router.go(-1)
          } else {
            this.$toast.fail(res.data.message)
          }
        })
      },
      afterRead1(content) {
        console.log(content);
        var params = this.qs.stringify({
          img: content.content,
          token: getStore("token"),
          if_corp: getStore("if_corp")
        })
        this.$axios.post('user/certifyupload', params).then((res) => {
          if ( res.data.status == 1 ) {
            this.$toast.success(res.data.message)
            this.img.push(res.data.data.img_path)
            this.front = 'http://www.menpuwang.com/' +res.data.data.img_path
          } else {
            this.$toast.fail(res.data.message)
          }
        })
      },
      afterRead2(content){
        var params = this.qs.stringify({
          img: content.content,
          token: getStore("token"),
          if_corp: getStore("if_corp")
        })
        this.$axios.post('user/certifyupload', params).then((res) => {
          if ( res.data.status == 1 ) {
            this.$toast.success(res.data.message)
            this.img.push(res.data.data.img_path)
            this.back = 'http://www.menpuwang.com/' + res.data.data.img_path
          } else {
            this.$toast.fail(res.data.message)
          }
        })
      },
      onClickLeft() {
        this.$router.go(-1)
      },
    },
    created() {
    }
  }
</script>
<style lang="scss" scoped>
  @import "../../../static/css/user/autonym.scss";

  .upload {
    div {
      width: 100%;
      height: 370px;
      overflow: hidden;

      &:first-child {
        margin-bottom: 30px;
      }

      &:nth-child(2) {
        margin-bottom: 20px;
      }

      img {
        width: 100%;
        height: 100%
      }
    }
  }
</style>
